<!--
*@Author: QWP
*@Description: 选择人员的下拉树
*@Date: 2024-09-10 09:13:29
-->
<template>
  <TreeSelect 
    :treeData="treeData"
    v-bind="$attrs"
    @click="treeClick">
  </TreeSelect>

  <!-- 选中人员弹窗 -->
  <!-- <Modal v-model:open="showSelUser"></Modal> -->
  <SelRoleUser v-model:open="showSelUser"
    v-bind="$attrs"
    :selData="$attrs['value']"
    :multiple="$attrs['multiple']"
    @submit="selSubmit">
  </SelRoleUser>
  
</template>

<script lang='ts' setup>
import { ref, reactive, computed, onMounted, useAttrs, watch, isRef } from 'vue' 
import { useBaseStore } from '@/store'
import { storeToRefs } from 'pinia'
import { useRoute, useRouter } from 'vue-router'
import { evectionUserTree } from '@/service/administration/travel'
import { uniqBy, cloneDeep } from 'lodash'
import { TreeSelect, Modal } from 'ant-design-vue'
import SelRoleUser from './SelRoleUser.vue'
import * as userApi from '@/service/system/user'

defineOptions({
  name: 'u-selroleuser-tree'
})

const attrs = useAttrs()
const { deptUsers } = storeToRefs(useBaseStore())

let showSelUser = ref<boolean>(false)

const emits = defineEmits(['submit', 'update:value'])

onMounted(() => {
  getRoles()
})

// 获取部门人员数据
const roleUserData = ref([])
const treeData = computed(() => {
  let tExData = attrs['extraData'] || [];
  let resultData = [ ...(isRef(tExData) ? tExData.value : tExData) , ...(attrs['isLoadData'] == false ? [] : roleUserData.value)]
  let resultData1 = [];
  resultData.forEach((item => {
    let iTem = cloneDeep(item)
    delete iTem['children']
    resultData1.push(iTem)
    if((item.children || []).length != 0) {
      resultData1.splice(resultData1.length, 0, ...item.children)
    }
  }))
  return uniqBy(resultData1, item => item.keyid)
})

// 获取角色人员信息数据
function getRoles() {
  userApi.roleuserselectdata().then(res => {
    if(res.code == 0) {
      roleUserData.value = res.data || [];
    }
  })
}

// 下拉树点击
const treeClick = () => {
  setTimeout(() => {
    if(showSelUser.value == true) return
    showSelUser.value = true
  }, 500);
}

// 选中人员保存回调
const selSubmit = (data) =>  {
  let keyids = data.map(i => i.keyid)
  emits('update:value', attrs['multiple'] == false ? keyids.join('') : keyids)
  emits('submit', attrs['multiple'] == false ? keyids.join('') : keyids, data)
  showSelUser.value = false;
}
</script>

<style lang='scss' scoped>
</style>